<template>
    <view class="box">
        <view class="list" v-for="item in 5">
            <view class="order" style="margin:20rpx 0 0 20rpx;">
                <text style="width: 332rpx;height: 34rpx;font-weight: 500;font-size: 24rpx;
                color: #333333;text-align: center;">订单编号：132423423453434</text>
            </view>
            <view style="display: flex;">
            <view class="one">
                <image src="/static/images/logo.jpg" style="
               margin:6rpx 0 0 20rpx;width: 193rpx;
                height: 150rpx;"></image>
            </view>
            <view class="two">
                <view class="center1">
                    儿童体检
                </view>
                <view  style="display: flex;">
                <view class="center2">
                    包含内科检查、外科检查、视力筛查五官检查，系统检查
                    
                </view>
                <view style="height: 28rpx;width: 28rpx;"><image src="/static/images2/右箭头.png" style="width: 100%;height: 100%;"></image></view>
                </view>
            </view>
            </view>
            <view class="three" style="display: flex;">
               <view class="right1">预约时间：2025/04/03 09:30:0</view>
                <view class="right2">
                    <view class="text">信息填写</view>
                </view>
            </view>
        </view>
    </view>
</template>

<script>
    export default {
        data() {
            return {

            }
        },
        methods: {

        }
    }
</script>

<style lang="scss">
    .box {
        width: 750rpx;
        height: 1624rpx;
        background: #F7F8FA;
    }

    .list {
        // display: flex;
        margin: 32rpx 32rpx 0;
        // border: 1rpx solid black;
        width: 686rpx;
        height: 294rpx;
        background: #FFFFFF;
        border-radius: 16rpx 16rpx 16rpx 16rpx;
    }

    .onge {
        width: 193rpx;
        height: 150rpx;
        background: #F6F6F6;
        border-radius: 12rpx 12rpx 12rpx 12rpx;

        image {
            width: 193rpx;
            height: 150rpx;
        }
    }

    .center1 {
        margin-top: 24rpx;
        height: 40rpx;
        font-family: PingFang SC, PingFang SC;
        font-weight: 500;
        font-size: 28rpx;
        color: #333333;
        text-align: left;
        font-style: normal;
        text-transform: none;
    }

    .center2 {
        margin-top: 10rpx;
        width: 334rpx;
        height: 68rpx;
        font-family: PingFang SC, PingFang SC;
        font-weight: 400;
        font-size: 24rpx;
        color: #626262;
        text-align: left;
        font-style: normal;
        text-transform: none;
    }

    .right1 {
        margin: 22rpx 0rpx 0 28rpx;
       width: 352rpx;
       height: 34rpx;
       font-family: PingFang SC, PingFang SC;
       font-weight: 400;
       font-size: 24rpx;
       color: #159DFF;
       text-align: left;
       font-style: normal;
       text-transform: none;
    }

    .right2 {
        margin: 14rpx 0 0 174rpx;
       width: 112rpx;
       height: 50rpx;
       background: #FE7A3E;
       border-radius: 8rpx 8rpx 8rpx 8rpx;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .text {
       width: 96rpx;
       height: 34rpx;
       font-family: PingFang SC, PingFang SC;
       font-weight: 400;
       font-size: 24rpx;
       color: #FFFFFF;
       text-align: left;
       font-style: normal;
       text-transform: none;
    }
</style>